<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="Neon Admin Panel">
    <meta name="author" content="">

    <title>系统后台管理</title>


    <link rel="stylesheet" href="static/css/jquery-ui-1.10.3.custom.min.css">
    <link rel="stylesheet" href="static/css/entypo.css">
    <link rel="stylesheet" href="static/css/css.css">
    <link rel="stylesheet" href="static/css/bootstrap.css">
    <link rel="stylesheet" href="static/css/neon-core.css">
    <link rel="stylesheet" href="static/css/neon-theme.css">
    <link rel="stylesheet" href="static/css/neon-forms.css">
    <link rel="stylesheet" href="static/css/custom.css">

    <script src="static/js/jquery-1.11.0.min.js"></script>

    <!--[if lt IE 9]>
    <script src="assets/js/ie8-responsive-file-warning.js"></script><![endif]-->

    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
    <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->


</head>
<body class="page-body login-page login-form-fall" data-url="http://neon.dev" style="background: url(https://img.zcool.cn/community/01adf05c7ddbe9a801203d220c179e.jpg?x-oss-process=image/auto-orient,1/resize,m_lfit,w_1280,limit_1/sharpen,100/quality,q_100);background-size: cover;background-position-y: 10vh;">


<!-- This is needed when you send requests via Ajax -->
<script type="text/javascript">
    var baseurl = '';
</script>

<div class="login-container">

    <div class="login-header login-caret">

        <div class="login-content">

            <a href="index.html" class="logo" style="color:white;font-size:24px;">
                系统后台管理
            </a>

            <!--<p class="description">Dear user, log in to access the admin area!</p>-->

            <!-- progress bar indicator -->
            <div class="login-progressbar-indicator">
                <h3>43%</h3>
                <span>logging in...</span>
            </div>
        </div>

    </div>

    <div class="login-progressbar">
        <div></div>
    </div>

    <div class="login-form" id="app">

        <div class="login-content">

            <div class="form-login-error">
                <h3>Invalid login</h3>
                <p>Enter <strong>demo</strong>/<strong>demo</strong> as login and password.</p>
            </div>

            <form method="post" role="form" id="form_login">

                <div class="form-group">

                    <div class="input-group">
                        <div class="input-group-addon">
                            <i class="entypo-user"></i>
                        </div>

                        <input type="text" class="form-control" v-model="uname" id="uname" placeholder="用户名"
                               autocomplete="off">
                    </div>

                </div>

                <div class="form-group">

                    <div class="input-group">
                        <div class="input-group-addon">
                            <i class="entypo-key"></i>
                        </div>

                        <input type="password" class="form-control" v-model="upass" id="upass" placeholder="密码"
                               autocomplete="off">
                    </div>

                </div>

                <div class="form-group">
                    <button type="button" class="btn btn-primary btn-block btn-login" @click="login()">
                        <i class="entypo-login"></i>
                        登录
                    </button>
                </div>

                <!--<div class="form-group">-->
                    <!--<em>- or -</em>-->
                <!--</div>-->

                <!--<div class="form-group">-->

                    <!--<button type="button" class="btn btn-default btn-lg btn-block btn-icon icon-left facebook-button">-->
                        <!--Login with Facebook-->
                        <!--<i class="entypo-facebook"></i>-->
                    <!--</button>-->

                <!--</div>-->

                <!--

                You can also use other social network buttons
                <div class="form-group">

                    <button type="button" class="btn btn-default btn-lg btn-block btn-icon icon-left twitter-button">
                        Login with Twitter
                        <i class="entypo-twitter"></i>
                    </button>

                </div>

                <div class="form-group">

                    <button type="button" class="btn btn-default btn-lg btn-block btn-icon icon-left google-button">
                        Login with Google+
                        <i class="entypo-gplus"></i>
                    </button>

                </div> -->
            </form>


            <!--<div class="login-bottom-links">-->

                <!--<a href="extra-forgot-password.html" class="link">Forgot your password?</a>-->

                <!--<br>-->

                <!--<a href="#">ToS</a> - <a href="#">Privacy Policy</a>-->

            <!--</div>-->

        </div>

    </div>

</div>


<!-- Bottom Scripts -->
<script src="static/js/main-gsap.js"></script>
<script src="static/js/jquery-ui-1.10.3.minimal.min.js"></script>
<script src="static/js/bootstrap.js"></script>
<script src="static/js/joinable.js"></script>
<script src="static/js/resizeable.js"></script>
<script src="static/js/neon-api.js"></script>
<script src="static/js/jquery.validate.min.js"></script>
<script src="static/js/neon-login.js"></script>
<script src="static/js/neon-custom.js"></script>
<script src="static/js/neon-demo.js"></script>



<script type="text/javascript" src="../axios/vue.js"></script>
<script type="text/javascript" src="../axios/axios.min.js"></script>
<script type="text/javascript" src="../axios/qs.js"></script>
<script type="text/javascript" src="../layer/layer.js"></script>
<script type="text/javascript" src="../axios/getUrlParams.js"></script>

<script>
    var qs = Qs
    var vue=new Vue({
        el:"#app",
        data:{
            uname:"",
            upass:"",
        },
        methods:{
            login(){

                if(this.uname==""){
                    layer.msg("用户名不能为空",{icon:5})
                    return false;
                }
                if(this.upass==""){
                    layer.msg("密码不能为空",{icon:5})
                    return false;
                }
                axios.post('login',qs.stringify({
                    uname:this.uname,
                    upass:this.upass,
                })).then(response =>{
                    if(response.data.data ==400){
                        layer.msg("用户名或密码错误",{icon:5})

                        // showNotify('top', 'center', "warning","提示","只能编辑一条数据哦！");
                    }else{
                        window.location.href="index.html"
                    }
                }).catch(error =>{
                    console.log(error)
                })
            },
        }
    })
</script>

</body>
</html>
